<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>账号设置</title>

<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">
        <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
        <script src="https://cdn.staticfile.org/popper.js/1.12.5/umd/popper.min.js"></script>
        <script src="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/js/bootstrap.min.js"></script>
</head>
<body>
<!--导航栏-->
<nav class="navbar navbar-expand-sm  navbar-dark " style="height:10%;background-color: #2C3D59">                
        <h5 class=" ml-5" style="color:#FFFFFF">基于深度学习的旗袍识别系统</h5>
        <div style="margin-left: 66%">
  
                <div class="dropdown"><!--下拉菜单-->
                  <a class="text-white dropdown-toggle" data-toggle="dropdown">
                      <img style="height: 20px;width: 20px;-webkit-border-radius:10px;-moz-border-radius:10px;background-color:#FFFFFF" 
                      src="common/image/user.png"> &nbsp;admin</a>
                  <div class="dropdown-menu small">
                    <a class="dropdown-item" href="#">
                            <img style="height: 20px;width: 20px;border-left:1px #00FF66" src="common/image/setting.png">设置
                    </a>
                    <a class="dropdown-item" href="#">
                        <img style="height: 20px;width: 20px;border-left:1px #00FF66" src="common/image/poweroff.png">退出
                    </a>
                  </div>
                </div>   
        </div>               
</nav>
  
        <!--左侧目录-->
        <div class="container-fluid" style="margin-top:0px;">
          <div class="row">
            <div class="col-sm-2" style="background-color:#EBF2FE;height: 580px;">
              <ul class="nav nav-pills flex-column ml-3 mt-5">
                <li class="nav-item">
                  <a class="nav-link" href="crawler.html"><img src="common/image/crawler.jpg" style="height: 50px;width: 50px;">爬虫</a>
                </li>
                <li class="nav-item mt-4">
                  <a class="nav-link" href="label.html"><img src="common/image/edit-square.png" style="height: 50px;width: 50px;">标注</a>
                </li>
                <li class="nav-item mt-4">
                  <a class="nav-link" href="classify.html"><img src="common/image/qiPao.jpg" style="height: 50px;width: 50px;">分类</a>
                </li>
                <li class="nav-item mt-4">
                      <a class="nav-link" href="algorithm.html"><img src="common/image/algorithm1.jpg" style="height: 50px;width: 50px;">算法</a>
                    </li>
              </ul>
              <hr class="d-sm-none">
            </div>
  
            <div class="col-sm-10">
                <div style="height: 30;width: 40%;margin-left:30%;margin-top:8%">
                <!-- 这里是主模板 -->
                    <h3 class="text-center">账号设置</h3>
                    <form class="mt-5">
                        <div class="form-group">
                            <label for="usr">用户名:</label>
                            <input type="text" placeholder="请输入新用户名" class="form-control" id="usr" value="admin"><!--默认值为当前账号-->
                        </div>
                        <div class="form-group">
                            <label for="pwd">密码:</label>
                            <input type="password" placeholder="请输入新密码" class="form-control" id="pwd">
                        </div>
                        <button type="submit" class="btn btn-primary mt-5 ml-5" style="width:80%">保存</button>
                    </form>

                </div>
            </div>
           </div>
        </div>
</body>
</html>